#header { background: url('../images/cokhi-trans.png') no-repeat top center; margin-top: 5px; padding-bottom: 3px; border-bottom: 2px solid #E7E7E7;}
    #header .logo { margin-right: 0;}
        .logo img { height: 110px; }
    #header h1 { line-height: 35pt; margin-bottom: 15px; font-size: 27pt; font-weight: bold; color: #0000ff; word-spacing: 10px; }
    #header h1 span { color: #ff0000; }
    #header .company-info { }
    #header .company-info p { word-spacing: 5px; }
    #header .company-info p:last-child { margin-bottom: 0; }
    #header .tencol .sevencol p:last-child { margin-bottom: 9px; }

    #header .search { height: 50px; background: url('../images/box-search.png') no-repeat 0 0; position: relative; top: 10px; }
        .search input[type="text"] { width: 230px; background: none; border: none; position: relative; top: 7px; left: 10px; padding: 5px; }
         .search input[type="submit"] { padding: 1px 0; background: #000; border: none; color: white; cursor: pointer; position: absolute; top: 10px; right: 44px; }
    #header .tencol.last { position: relative; }
    #header .header-image { position: absolute; right: 26px; top: 0; width: 147px; }

#wrapper {}
    /*---------------- menu----------------------*/
    #wrapper .menu { }
        .btn-navbar { display: none; }
        /* remove all the bullets, borders and padding from the default list styling */
        .menu ul { }
        /* style the sub-level lists */
        .menu ul ul { width: auto; }
        /* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
        .menu ul li { float: left; margin-left: 10px; padding: 5px 15px; background: none; position: relative; }
        .menu ul li a { color: #676767; text-transform: uppercase; }
        .menu ul li.active { background: url('../images/bg-menu.png') repeat-x 0 0; }
        .menu ul li.active a { color: white; }
        .menu ul li:first-child { margin-left: 0;}

        /* style the sub level list items */
        .menu ul ul li {  width: auto; height:auto; margin-left: 0 !important; border-radius: 0 !important; clear: both; display: block; position: relative; line-height: 1em; }

        /* style the sub level links */
        .menu ul ul a, .menu ul ul a:visited { min-width: 7em; }
        .menu ul table ul a, .menu ul table ul a:visited  {min-width: 7em; min-width: 7em;}

        /* style the table so that it takes no part in the layout - required for IE to work */
        .menu table {position:absolute; left:0; top:0; font-size:1em; z-index:-1;}
        .menu ul ul table {left:-1px;}
        .menu ul ul table ul.left {margin-left:2px;}

        .menu li:hover {position:relative;}
        * html .menu a:hover {position:relative;}

        /* style the third level background */
        .menu ul ul ul a, .menu ul ul ul a:visited { }
        /* style the fourth level background */
        .menu ul ul ul ul a, .menu ul ul ul ul a:visited {}
        /* style the sub level 1 background */
        .menu ul :hover a.sub1 {}
        /* style the sub level 2 background */
        .menu ul ul :hover a.sub2 {}

        /* style the level hovers */
        /* first */
        .menu a:hover {}
        .menu :hover > a {}
        /* second */
        .menu ul ul a:hover{}
        .menu ul ul :hover > a {}
        /* third */
        .menu ul ul ul a:hover {}
        .menu ul ul ul :hover > a {}
        /* fourth */
        .menu ul ul ul ul a:hover {}

        /* hide the sub levels and give them a positon absolute so that they take up no room */
        .menu ul ul {visibility:hidden;position:absolute;height:0;top:30px;left:0;min-width: 7em; z-index:999;}

        /* position the third level flyout menu */
        .menu ul ul ul{ left:100% ;top: 0; min-width: 7em; }

        /* position the third level flyout menu for a left flyout */
        .menu ul ul ul.left {left:-14em;}

        /* make the second level visible when hover on first level list OR link */
        .menu ul li:hover ul, .menu ul a:hover ul {visibility:visible; height:auto; padding-bottom:3em; }
        /* keep the third level hidden when you hover on first level list OR link */
        .menu ul :hover ul ul{visibility:hidden;}
        /* keep the fourth level hidden when you hover on second level list OR link */
        .menu ul :hover ul :hover ul ul{visibility:hidden;}
        /* make the third level visible when you hover over second level list OR link */
        .menu ul :hover ul :hover ul{visibility:visible;}
        /* make the fourth level visible when you hover over third level list OR link */
        .menu ul :hover ul :hover ul :hover ul {visibility:visible;}

    /* slide */
    .nivo-caption h2 { color: #0000ff; font-size: 15pt; }
    .nivo-caption h2 span { color: #ff0000; }
    .nivo-caption p { color: #4f4f4f; }

    /* main */
    #wrapper .main {}
        .main .module { margin-top: 20px; overflow: hidden; }
        .main .module:first-child { }
            .module li { float: left; }
            .module h2 { line-height: 40px; max-height: 80px; margin-bottom: 15px; padding-left: 50px; overflow: hidden; }

    #wrapper .main-content { }
        .main-content .module { margin-top: 20px; overflow: hidden; }
        .main-content .module:first-child { margin-top: 0; }
        .main-content .product-list {  }
            .product-list h2 { background: url('../images/product.png') no-repeat 0 0; }
            .product-list .product { width: 33.1%; height: 270px; background-color: #717171; border-left: 1px solid white; overflow: hidden; }
            .product-list .product:first-child { border-left: none; }
            .product-list .product .product-image { border-bottom: 1px solid white; }
            .product-list .product .product-image img { width: 214px; height: 150px; }
            .product-list .product h4 { height: 30px; margin-bottom: 0; padding: 0 5px; background: #5a5a5a; border-bottom: 1px solid white; color: white; text-align: right; overflow: hidden; }
            .product-list .product .info { padding: 0 5px; }
            .product-list .product .info a { color: white; }
            .product-list .product .info p { max-height: 61px; }

        .main-content .construction { }
        .main-content .construction h2 { background: url('../images/construction.png') no-repeat 0 0; }
        .main-content .construction .news { margin-bottom: 10px; overflow: hidden; }
            .construction .news img { float: left; width: 150px; margin-right: 3%; }
            .construction .news h4 { line-height: 27px; margin-bottom: 15px; }
            .construction .news p {  }
            .construction .news a.more { float: right; padding: 5px 10px; background: #ff0000; color: white; ; }
            .dt-prod .main-image img { width: 100%; }
            .dt-prod .main-image ul { margin-top: 20px; }
            .dt-prod .main-image li img { width: 70px; }
        .main-content .news-relation { border-top: 3px double #676767; }
            .news-relation a { }

        .comment_section { }
        .comment_section.child {
            margin-left: 50px;
        }

        .comment_section li {
            width: 100%;
            list-style: none outside none;
            margin-bottom: 30px;
        }
        .comment_section.child li {
            margin-bottom: 10px;
        }

        .parent li .comment_box {
            background: none repeat scroll 0 0 #D3D3D3;
            clear: both;
            padding: 15px 15px 0;
        }
        .parent .child li .commentbox1 {
            background: none repeat scroll 0 0 #F4F4F4;
            border-bottom: 1px solid #D7D1E2;
        }

            .comment_box .gravatar {
                background: none repeat scroll 0 0 #000000;
                float: left;
                margin-right: 15px;
                width: 50px;
            }
            .comment_box .gravatar img {
                height: 50px;
                margin: 0;
                width: 50px;
            }
            .comment_box .comment_text {
                margin: 0 0 0 65px;
            }
            .comment_text .comment_author {
                color: #000000;
                font-size: 14pt;
                font-weight: bold;
                margin-bottom: 10px;
            }
            .comment_text .date {
                color: #000000;
                font-weight: normal;
                padding-left: 10px;
            }
            .comment_text p { text-align: left; }

        .main-content .our-customers { }
        .main-content .our-customers img { max-width: 122px; }
        .main-content .our-customers h2 { background: url('../images/our-customers.png') no-repeat 0 0; }
        .main-content .our-customers li { }
        .main-content .our-customers li:first-child { margin-left: 0px; }

    #wrapper .sidebar {}
    #wrapper .sidebar h2 { color: #0000ff; font-weight: bold; text-transform: uppercase; }
    #wrapper .sidebar .industries {  }
        .industries li { margin-top: 20px; overflow: hidden; }
        .industries li:first-child { margin-top: 0; }
        .industries li img { float: left; margin-right: 20px;}
        .industries h4 { line-height: 24px; margin-bottom: 10px; color: #0000ff; font-size: 14pt; }
        .industries h4 a { margin-bottom: 0; color: #ff0000; font-size: 24px; }
    #wrapper .sidebar .block { margin-top: 20px; overflow: hidden; }
    #wrapper .sidebar .block:first-child { margin-top: 0; }

    #wrapper .sidebar .video { overflow: hidden; }
        .video img { width: 100%; }
        .video ul { border: 1px solid #c0c0c0; overflow: hidden; }
        .video li { float: left; width: 25%; text-align: center; }
        .video li:first-child {margin-left: 0; }

    #wrapper .sidebar .contact { border: 1px solid #c0c0c0; overflow: hidden; }
        .sidebar .contact ul { padding: 10px 0; }
        .sidebar .contact ul li { margin-top: 10px; padding: 0 10px; overflow: hidden; }
        .sidebar .contact ul li:first-child{ margin-top: 0; }
        .sidebar .contact img { float: left; margin-right: 10px; }

.nivo-caption a { padding: 5px 20px; background: #ff0000; color: white; }

/* footer */
#footer { background: #4f4f4f; }
#footer .social { width: 10%; margin: 0 auto; padding: 15px 0; overflow: hidden; }
#footer .social li { float: left; margin-left: 10px; }
#footer .social li:first-child { margin-left: 0; }
#footer .info p { color: white; text-align: center;}



/* Smaller screens */

@media only screen and (max-width: 1023px) {

    body {
        font-size: 0.8em;
        /*line-height: 1.5em;*/
    }
    .search input[type="submit"] { right: 0; }
}

/* Mobile */

@media handheld, only screen and (max-width: 767px) {

    body {
        font-size: 16px;
        -webkit-text-size-adjust: none;
    }

    .row, body, .container {
        width: 100%;
        min-width: 0;
        margin-left: 0px;
        margin-right: 0px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .row .onecol, .row .twocol, .row .threecol, .row .fourcol, .row .fivecol, .row .sixcol, .row .sevencol, .row .eightcol, .row .ninecol, .row .tencol, .row .elevencol, .row .twelvecol {
        width: auto !important;
        float: none;
        margin-left: 0px;
        margin-right: 0px;
    }
    #header, #wrapper, #footer { padding: 0 5px; }

    #header .header-image {
        position: relative;
        right: -70px;
        top: 0;
        width: 147px;
    }
    #header h1 { margin-top: 40px; }

    .logo { text-align: center; }
    .search input[type="submit"] { padding: 1px 10px; background: #000; border: none; color: white; cursor: pointer; position: absolute; top: 10px; left: 247px; }

    /* menu */
    .menu { display: none !important; }
    .btn-navbar { display: block; }
    .menu ul li { float: none; }
    .menu.active { display: block !important; }

    /* slider */
    /*.theme-default .nivo-directionNav a { top: 55px; }
    .theme-default a.nivo-nextNav { right: 0; }
    .theme-default a.nivo-prevNav { left: 0; }*/
    .nivo-directionNav { display: none; }
    .theme-default .nivo-caption { top: 50%; left: 0; }
        /* Caption styles */
        .nivo-caption { background: #000; opacity: 0.8; }
        .nivo-caption h2 { height: 41px; overflow: hidden; }
        .nivo-caption h2, .nivo-caption p { color: white; }
        .theme-default .nivo-caption a { position: absolute; top: 121px; right: 0; border-bottom: none; }

    /* news */
    .construction .news a.more { position: relative; }

    /* customer */
    .main-content .our-customers li { float: left; margin-bottom: 10px; margin-left: 20px !important;}
    .main-content .our-customers li:first-child {  }

    #footer .social { width: 36%;}
}